import { useEffect } from 'react'
import { useDispatch, useSelector } from 'react-redux'
import avatar from '../assets/back.jpg'
import { RootState } from '../store'
import { getArticleList } from '../store/actions/article'
export default function NewsList() {
  const active = useSelector((state: RootState) => state.channel.active)
  const dispatch = useDispatch()
  const articles = useSelector((state: RootState) => state.article)

  useEffect(() => {
    dispatch(getArticleList(active))
    const getList = async () => {
      // const res = await axios.get(`http://10.2.1.44:3302/api/dataAnalysis/droneFlyDate`)
      // const res2 = await axios.get(`https://dev-api-drone.huidatech.cn/common/region`)
      // console.log(res, res2)
    }
    getList()
  }, [dispatch, active])

  return (
    <div className="list">
      {articles.map(item => {
        return (
          <div className="article_item" key={item.art_id}>
            <h3 className="van-ellipsis">{item.title}</h3>
            <div className="img_box">
              <img src={avatar} className="w100" alt="" />
            </div>
            <div className="info_box">
              <span>13552285417</span>
              <span>{item.comm_count}评论</span>
              <span>2018-11-29T17:02:09</span>
            </div>
          </div>
        )
      })}

    </div>
  )
}